{include file="common/pc/header" title="模块详情" /}

<style>
    #modules-detail img {
        width: 100px;
        height: 100px;
    }

    #enterprises img {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        cursor: pointer;
    }

    #enterprises li {
        float: left;
    }
</style>

<div id="modules-detail">
    <table class="layui-table">
        <tr>
            <td rowspan="2" width="100">
                <img src="/{$module.name}/logo.png" onerror="this.src='__IMAGES__/module.png';"/>
            </td>
            <td>模块ID:
                {if condition="isset($module['id'])"}
                {$module.id}
                {/if}
            </td>
            <td>模块标识: {$module.name}</td>
            <td>模块名称: {$module.title}</td>
        </tr>
        <tr>
            <td>模块版本：{$module.version}</td>
            <td>
                模块作者: {$module.author}<br/>
                <a href="{$module.url}" target="_blank">{$module.url}</a>
            </td>
            <td colspan="2">
                模块描述: {$module.description}
            </td>
        </tr>
        <tr>
            <td colspan="3">
                模块状态：
                {if condition="$module.status == 'inactive'"}
                <span class="layui-badge layui-bg-orange">未启用</span>
                {elseif condition="$module.status == 'active'"/}
                <span class="layui-badge layui-bg-green">已启用</span>
                {elseif condition="$module.status == 'uninstall' || $module.status == 'undownload'"/}
                <span class="layui-badge layui-bg-red">未安装</span>
                {/if}

                {if condition="$module.status == 'active'"}
                共有&nbsp;<span class="layui-badge layui-bg-blue">{php} echo count($enterprises) {/php}</span>&nbsp;家企业正在使用本模块
                <br/>
                <ul id="enterprises">
                    {foreach name="enterprises" item="enterprise"}
                    <li data-enterprise='{php}echo json_encode($enterprise);{/php}'>
                        <img src="{$enterprise.logo}" onerror="this.src='__IMAGES__/enterprise.png'"
                             alt="{$enterprise.title}"/>
                    </li>
                    {/foreach}
                </ul>
                {/if}
            </td>
            <td>
                {if condition="$module.status == 'inactive'"}
                <a class="layui-btn layui-btn-sm layui-btn-success" href="javascript:;" id="active">启用模块</a>
                <a class="layui-btn layui-btn-sm layui-btn-danger" href="javascript:;" id="uninstall">卸载模块</a>
                {elseif condition="$module.status == 'active'"/}
                <a class="layui-btn layui-btn-sm layui-btn-warm" href="javascript:;" id="inactive">停用模块</a>
                {elseif condition="$module.status == 'undownload' || $module.status == 'uninstall'"/}
                <a class="layui-btn layui-btn-sm" href="javascript:;" id="install">安装模块</a>
                {/if}
            </td>
        </tr>
    </table>
    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
        <ul class="layui-tab-title">
            <li class="layui-this">API列表</li>
            <li>后台菜单</li>
            <li>前台入口</li>
            <li>配置项</li>
            <li>功能权限</li>
            <li>微应用</li>
            <li>挂件</li>
            <li>定时任务</li>
        </ul>
        <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
                <table class="layui-table">
                    <colgroup>
                        <col width="150">
                        <col width="150">
                        <col>
                        <col width="150">
                        <col width="250">
                    </colgroup>
                    <thead>
                    <tr>
                        <td>API名称</td>
                        <td>API标题</td>
                        <td>API介绍</td>
                        <td>API分组</td>
                        <td title="本模块需要授权访问的字段信息">
                            授权字段
                        </td>
                    </tr>
                    </thead>
                    <tbody>
                    {foreach name="apiInfos" item="apiInfo" key="apiName" }
                    <tr>
                        <td>{$apiName}</td>
                        <td>{$apiInfo.title}</td>
                        <td>{$apiInfo.desc}</td>
                        <td>{$apiInfo.group}</td>
                        <td>
                            {if condition="isset($apiInfo['fieldInfos']) && is_array($apiInfo['fieldInfos'])"}
                            <ul>
                                {foreach name="apiInfo['fieldInfos']" item="fieldTitle" key="fieldName"}
                                <li>{$fieldName}（{$fieldTitle}）</li>
                                {/foreach}
                            </ul>
                            {/if}
                        </td>
                    </tr>
                    {/foreach}
                    </tbody>
                </table>
            </div>
            <div class="layui-tab-item"></div>
            <div class="layui-tab-item"></div>
            <div class="layui-tab-item"></div>
            <div class="layui-tab-item"></div>
            <div class="layui-tab-item"></div>
            <div class="layui-tab-item"></div>
            <div class="layui-tab-item"></div>
        </div>
    </div>
</div>

<script id="enterpriseInfo" type="text/html">
    <ul class="enterpriseInfoList">
        <li>企业名称：{{ d.title || '' }}</li>
        <li>联系人：{{ d.contacter || '' }}</li>
        <li>联系电话：{{ d.phone || '' }}</li>
        <li>企业备注：{{ d.description || '' }}</li>
    </ul>
</script>

<script>
    layui.use(['laytpl', 'element'], function () {
        window.laytpl = layui.laytpl;
    });

    // 企业列表鼠标悬浮显示企业信息
    $("#enterprises li").mouseover(function () {
        var that = this;
        var enterprise = eval("(" + $(this).attr("data-enterprise") + ")");
        laytpl($("#enterpriseInfo").html()).render(enterprise, function (html) {
            var idx = layer.tips(html, that, {time: 0});
            $(that).data("layer_tips_idx", idx);
        });
    });
    $("#enterprises li").mouseout(function () {
        layer.close($(this).data("layer_tips_idx"));
    });

    // 企业列表点击显示企业信息
    $("#enterprises li").click(function () {
        var enterprise = eval("(" + $(this).attr("data-enterprise") + ")");
        console.dir(enterprise);
        var link = "/core/site.enterprise/detail?eid=" + enterprise.id;
        if (window.parent && window.parent.openTab) {
            window.parent.openTab(false, link, "site_enterprise_" + enterprise.id);
        } else {
            window.location.href = link;
        }
    });

    // 启用模块
    $("#active").click(function () {
        var confirmContent = '您确定要<span class="layui-badge layui-bg-green">启用</span>模块【{$module.title}】?';
        layer.confirm(confirmContent, {title: '询问'}, function (index) {
            g.loading();
            $.post("/core/site.module/active/" + encodeURIComponent('{$module.name}'), {_: new Date().getTime()}, function (ret) {
                layer.close(index);
                g.loading(false);
                if (ret.code == 0) {
                    layer.alert(ret.msg);
                } else {
                    layer.msg("操作成功，页面刷新中...")
                    document.location.href = "/core/site.module/detail/{$module.name}";
                }
            }, "json");
        });
    });

    // 停用模块
    $("#inactive").click(function () {
        var html = "";
        var enterprisesCount = $("#enterprises li").length;
        if (enterprisesCount > 0) {
            html += "<span style='color:red;'>停用应用将会导致<span class='layui-badge layui-bg-red'>" + enterprisesCount + "</span>家企业的应用无法使用！</span><br/>";
        }
        html += '您确定要继续<span class="layui-badge layui-bg-orange">停用</span>模块【{$module.title}】吗?';
        layer.confirm(html, {title: '询问'}, function (index) {
            g.loading();
            $.post("/core/site.module/inactive/" + encodeURIComponent('{$module.name}'), {_: new Date().getTime()}, function (ret) {
                layer.close(index);
                g.loading(false);
                if (ret.code == 0) {
                    layer.alert(ret.msg);
                } else {
                    layer.msg("操作成功，页面刷新中...")
                    document.location.href = "/core/site.module/detail/{$module.name}";
                }
            }, "json");
        });
    });

    // 安装模块
    $("#install").click(function () {
        var confirmContent = '您确定要<span class="layui-badge layui-bg-green">安装</span>模块【{$module.title}】吗?';
        layer.confirm(confirmContent, {title: '询问'}, function (index) {
            g.loading();
            $.post("/core/site.module/install/" + encodeURIComponent('{$module.name}'), {_: new Date().getTime()}, function (ret) {
                layer.close(index);
                g.loading(false);
                if (ret.code == 0) {
                    layer.alert(ret.msg);
                } else {
                    layer.msg("操作成功，页面刷新中...")
                    document.location.href = "/core/site.module/detail/{$module.name}";
                }
            }, "json");
        });
    });

    // 卸载模块
    $("#uninstall").click(function () {
        var confirmContent = '<span style="color: red;">卸载模块将会删除模块相关的所有业务数据</span>，' +
            '您确定要继续<span class="layui-badge layui-bg-danger">卸载</span>模块【{$module.title}】吗?';
        var confirmEditContent = '<span style="color: red;">卸载模块将会删除模块相关的所有业务数据</span><br/>' +
            '如果要继续删除，请输入当前模块标识：' +
            '<input class="layui-input" type="input" placeholder="请输入当前要删除的模块标识"/>';
        layer.confirm(confirmContent, {title: '询问'}, function (confirmIndex) {
            layer.alert(confirmEditContent, {title: '危险操作再次确认'}, function (confirmEditIndex, layero) {
                if (layero.find("input").val() != '{$module.name}') {
                    layer.alert("模块标识输入错误，无法卸载模块", {zIndex: 99999999});
                    return;
                }
                layer.close(confirmEditIndex);
                g.loading();
                $.post("/core/site.module/uninstall/" + encodeURIComponent('{$module.name}'), {_: new Date().getTime()}, function (ret) {
                    layer.close(confirmIndex);
                    g.loading(false);
                    if (ret.code == 0) {
                        layer.alert(ret.msg);
                    } else {
                        layer.msg("操作成功，页面刷新中...")
                        document.location.href = "/core/site.module/detail/{$module.name}";
                    }
                }, "json");
            });
        });
    });
</script>

<!-- 初始化操作 -->
{if condition="isset($initAction) && $initAction"}
<script>
    $(document).ready(function () {
        layui.use(['layer'], function () {
            setTimeout('$("#{$initAction}").click()', 500);
        });
    });
</script>
{/if}


{include file="common/pc/footer"/}